import React, { Component } from 'react'
import {inject, observer} from 'mobx-react'

@inject('appStore')
@observer

class AppleList extends Component {
  constructor(props){
    super(props)
  }
  render() {
    const { current } = this.props.appStore
    const {
      appleNow: { count: notEatenQuantity, weight: notEatenWeight },
      appleEaten: { count: EatenQuantity, weight: EatenWeight }
    } = current;
    return(
      <div className="stats">
        <div className="section">
          <div className="head">当前</div>
          <div className="content">
            {notEatenQuantity}个苹果，{notEatenWeight}克
          </div>
        </div>
        <div className="section">
          <div className="head">已吃掉</div>
          <div className="content">
            {EatenQuantity}个苹果，{EatenWeight}克
          </div>
        </div>
      </div>
    )
  }
}

export default AppleList
